
import React, { useEffect, useState, } from 'react'

import { Form, Input, Button, notification, Upload, DatePicker, ConfigProvider, } from 'antd'

import service from "../../../api"
import { useNavigate, } from 'react-router-dom'
import { useDispatch } from 'react-redux'
import "./GoodAdd.scss"
import 'dayjs/locale/zh-cn';
import locale from 'antd/locale/zh_CN';
import { PlusOutlined } from '@ant-design/icons'

interface Props {

}
function GoodAdd(props: Props) {
    const navigate = useNavigate()//路由

    const [form] = Form.useForm();


    const dispatch = useDispatch()//redux

    //登录验证
    var onFinish = async (formvalues: any) => {
        console.log(formvalues)
        // console.log(formvalues.img.fileList[0].thumbUrl)
        // let pic = formvalues.img[0].thumbUrl

        // let { img, ...values } = formvalues
        // console.log(values)

        //发起新增请求
        // const res = await service.shuju.good_add({ ...values, img: pic });
        const res = await service.shuju.good_add({ ...formvalues });
        console.log(res, "25")
        if (res) {
            notification.success({ message: '添加成功!' });
            console.log(res)
            navigate('/index/good')
        } else {
            notification.error({ message: '添加失败!' })
        }
    }
    //表单验证失败时执行
    var onFinishFailed = (formvalues: any) => {
        console.log(formvalues);
    }
    return (


        <div className='goodadd'>
            <div className="bigbox">
                <Form
                    form={form}
                    style={{ maxWidth: 600 }}
                    onFinish={onFinish}
                    onFinishFailed={onFinishFailed}
                    autoComplete='off'

                >
                    {/* <Form.Item
                        name="img"

                        label="上传图片"
                        valuePropName="fileList"
                        getValueFromEvent={e => {
                            if (Array.isArray(e)) {
                                return e;
                            }
                            return e && e.fileList;
                        }}
                    >
                        <Upload
                            action="/api/goodadd"
                            listType="picture-card"
                        >
                            <div>
                                <PlusOutlined />
                                <div style={{ marginTop: 1 }}>上传图片 </div>
                            </div>
                        </Upload>
                    </Form.Item> */}

                    <Form.Item
                        name="img"
                        label="图片"
                    >
                        <Input placeholder="图片" />
                    </Form.Item>


                    <Form.Item
                        name="name"
                        label="商品信息"
                    >
                        <Input placeholder="商品信息" />
                    </Form.Item>

                    <Form.Item
                        name="money"
                        label="商品价格"
                    >
                        <Input placeholder="商品价格" />
                    </Form.Item>
                    <Form.Item
                        name="xiaoshou"
                        label="销售量"
                    >
                        <Input placeholder="销售量" />
                    </Form.Item>

                    <Form.Item
                        name="state"
                        label="商品状态"
                    >

                        <Input placeholder="商品状态" />
                    </Form.Item>
                    <Form.Item
                        name="time"
                        label="上架时间">
                        <ConfigProvider locale={locale}>
                            <DatePicker placeholder='请选择日期' />
                        </ConfigProvider>
                    </Form.Item>
                    <Form.Item
                        name="hao"
                        label="排序号"
                    >
                        <Input placeholder="排序号" />
                    </Form.Item>

                    <Form.Item wrapperCol={{ span: 24 }}>
                        <Button block type="primary" htmlType="submit">
                            提交
                        </Button>
                    </Form.Item>
                </Form>
            </div>
        </div>
    );
}

export default GoodAdd;